

<div id="tabla_admin">

<div id="resultado_admin">
<table id="tabla"></table>
<div id="pager"></div>
</div>

<div style="margin-top: 40px;text-align:center;">
<input type="submit" id="busqueda" value="Buscar" />
</div>
</div>

<div id="dialog_busqueda" style="display:none;">

<div id="dato_busqueda">
<div id="texto_dato"><label>Seleccione opcion:</label></div>

<div style="width:200px;float:right;">
<select id="select" style="width:100px;font-size: 15px;">
<option>Curso</option>
<option>Codigo</option>
<option>Creditos</option>
<option>Plan</option>
</select>
</div>

</div>

<div id="dato_busqueda">
<div id="texto_dato">Seleccione :</div><input type="text" id="dato" style="width:194px;height:15px;float:right;" />
</div>

<div style="text-align: center;"><input type="submit" id="submit_busqueda" style="font-size: 15px;" value="Busqueda" /></div>

</div>


<script type="text/javascript">

	$(document).ready(function(){
		
		$('#tabla').jqGrid({
			url:'@{Administrador.busquedaCursoAdmin()}',
			datatype:'json',
			mtype:'get',
			colNames:['Numero ID','Curso','Codigo','Creditos','Plan'],
			colModel:[
			          {name:'id',index:'id',resizable:true,align:'center'},
			          {name:'nombrecurso',id:'nombrecurso',resizable:true,align:'center'},
			          {name:'codigocurso',id:'codigocurso',resizable:true,align:'center'},
			          {name:'numerocreditos',id:'numerocreditos',resizable:true,align:'center'},
			          {name:'plan',id:'plan',resizable:true,align:'center'},
			          ],
			rowNum:10,
			rowList:[10,20,30],
			sortname:'id',
			sortorder:'asc',
			pager:'#pager',
			caption:'Resultado de la Busqueda',
			viewrecords:true,
			height:300,
			jsonReader:{
				id:'0',
				repeatitems:false
			},
			serializeGridData:function(data){
				var $dato=$.trim($('#dato').val());
				var $tipodato=$('#select').val();
				
				delete data['nombrecurso'];
				delete data['codigocurso'];
				delete data['numerocreditos'];
				delete data['nombreplan'];
				
				if($dato!=''){
						if($tipodato=='Curso'){
							data.nombrecurso=$dato;
						}
						if($tipodato=='Codigo'){
							data.codigocurso=$dato;
						}
						if($tipodato=='Creditos'){
							data.numerocreditos=$dato;
						}
						if($tipodato=='Plan'){
							data.nombreplan=$dato;
						}
					}
				
				return data;
			}
		});
		
		$('#tabla').jqGrid('navGrid','#pager',{edit:false,add:false,del:false});
		
		$('#busqueda').button().click(function(){
		$('#dialog_busqueda').dialog({
			modal:true,
			width:430,
			height:160,
			title:'Busqueda'
		});
		});
		
		
		$('#select').change(function(){
			var $texto=$(this).val();
			var texto='Buscar por '+$texto;
			$('#texto_dato').text(texto);
		});
		
		$('#submit_busqueda').click(function(){
			$('#tabla').trigger('reloadGrid');
		});
		
	});

</script>